<html>
	<head>
		<script type="text/javascript" src="https://www.google.com/jsapi"></script>
		<script src="http://code.jquery.com/jquery-2.0.3.min.js"></script>
		<script type="text/javascript">
			var timeGraph	=
			{
				init	:	function()
				{
					var dataTable	=	new google.visualization.DataTable();
					var chart		=	new google.visualization.LineChart(document.getElementById('chart_div'));

					// Setting the data table.
					dataTable.addColumn('string', 'Number of cells');
					dataTable.addColumn('number', 'Time taken');

					$('.dataRow').each
					(
						function()
						{
							var data	=	$(this).data();
							console.log(data);

							dataTable.addRow([data.x.toString(), data.y]);
						}
					);

					// Set chart options
					var options	=
					{
						'title'		:	'How long it takes to biuld a map',
						'width'		:	800,
						'height'	:	300
					};

					// Draw chart, passing in data and options.
					chart.draw(dataTable, options);
				}
			}

			// Load the Visualization API and the core chart package.
			google.load('visualization', '1.0', {'packages':['corechart']});

			// Set a callback to run when the Google Visualization API is loaded.
			google.setOnLoadCallback(timeGraph.init);

		</script>
	</head>
	<body>
		<div id="chart_div"></div>

		<?php 
			include($_SERVER['DOCUMENT_ROOT'].'/Map.php');

			echo('<table cellpadding="5" cellspacing="0" border="1">');

			echo('<tr>');
				echo('<th>Map Dimension</th>');
				echo('<th>Time</th>');
			echo('</tr>');

			$multiplierFactor	=	2;

			for ($i=1; $i<=10; $i++)
			{
				$time_start	=	microtime(true);
				$map		=	new Map(10, $i*$multiplierFactor, 0);
				$time_end	=	microtime(true);
				$time		=	$time_end - $time_start;
				$x			=	10 * $multiplierFactor * $i;
				$y			=	$time;
				echo('<tr class="dataRow" data-x="' . $x . '" data-y="' . $y . '">');
					echo('<td>' . 10 . 'x' . $i*$multiplierFactor . '</td>');
					echo('<td>' . $time . '</td>');
				echo('</tr>');
			}
			echo('</table>');
		?>

	</body>
</html>